import React, { FC, useEffect, useState } from 'react';
import { View, Text, Image } from '@tarojs/components';
import { styled } from 'linaria/react';
import { useClassName } from '@/utils/index';
import { UserInfo_Web } from '@/pages/_server/_class/Mine/UserInfo';
export interface IProps extends ICompProps {
    userInfo: Partial<UserInfo_Web>;
}
UserInfo.defaultProps = {} as Partial<IProps>;
function UserInfo(props: IProps) {
    const { className, style, userInfo } = props;
    const localClassName = useClassName('UserInfo', className);
    return (
        <RootView className={localClassName} style={style}>
            <Image
                className="avatar"
                src={userInfo.avatarUrl || require('@/assets/images/noLogin_Avatar.png')}
                mode="scaleToFill"
            />
            <View className="userDetail">
                <View className="nickName">{userInfo.nickName}</View>
                <View className="contractAddress">合约地址：{userInfo.contractAddress}</View>
            </View>
        </RootView>
    );
}
export default React.memo(UserInfo as FC<IProps>);
const RootView = styled(View)`
    &.UserInfo {
        display: flex;
        align-items: center;
        .avatar {
            width: 120px;
            height: 120px;
            margin-right: 50px;
        }
        .userDetail {
        }
        .userNickName {
            font-size: 40px;
            font-weight: 600;
            color: #333333;
        }
        .contractAddress {
            font-size: 26px;
            font-weight: 400;
            color: #808a9d;
            line-height: 40px;
        }
    }
`;
